//
//  SearchView.swift
//  shop
//
//  Created by chen on 2025/5/17.
//

import SwiftUI

struct SearchView: View {
    
    @Environment(\.dismiss) private var dismiss
    
    @State private var text: String = ""
    
    @StateObject private var vm: SearchViewModel = SearchViewModel.shared
    
    @State private var rotationAngle: Double = 0
    
    @State private var pleaseHold: String = ""
    
    @EnvironmentObject private var router: Router
    
    var body: some View {
        VStack(spacing: 0) {
            // 顶部工具栏
            HStack(spacing: 3) {
                // 返回按钮
                Button {
                    dismiss()
                } label: {
                    Image(systemName: "chevron.left")
                        .foregroundColor(.black)
                        .font(.system(size: 20))
                }

                Spacer()
                
                // 搜索框
                HStack(spacing: 10) {
                    TextField(pleaseHold, text: $text)
                        .textFieldStyle(.plain)
                        .font(.system(size: 14))
                        .keyboardType(.default)
                        .modifier(DismissKeyboardOnTap())
                        .padding(.leading, 10)
                        .foregroundStyle(.black)
                        .tint(.red)
                        .onDebounceChange(of: text) { debouncedText in
                            // 这里处理防抖后的文本
                            if debouncedText.isEmpty {
                                vm.suggestion = []
                            } else {
                                vm.getSuggestion(keyWords: debouncedText)
                            }
                        }
                    
                    if !text.isEmpty {
                        Button {
                            text = ""
                        } label: {
                            Image(systemName: "xmark.circle.fill")
                                .font(.system(size: 15))
                                .foregroundStyle(Color.gray)
                        }
                    }
                    
                    Button {
                        if text.isEmpty {
                            router.to(.searchResult(keyWord: pleaseHold))
                        } else {
                            router.to(.searchResult(keyWord: text))
                        }
                    } label: {
                        Text("搜索")
                            .padding(.vertical, 5)
                            .font(.system(size: 15))
                            .foregroundStyle(.white)
                            .padding(.horizontal, 15)
                            .background(Color.red)
                            .cornerRadius(15)
                    }
                    .buttonStyle(PlainButtonStyle())

                }
                .padding(.vertical, 5)
                .padding(.horizontal, 3)
                .background(Color.searchBg)
                .cornerRadius(20)
            }
            .padding(.horizontal, 10)
            
            // 内容区
            ScrollView(showsIndicators: false){
                VStack(spacing: 0){
                    if !vm.suggestion.isEmpty {
                        VStack(spacing: 3) {
                            ForEach(vm.suggestion, id: \.self) { item in
                                Button {
                                    router.to(.searchResult(keyWord: item))
                                } label: {
                                    HStack(spacing: 10) {
                                        Image(systemName: "magnifyingglass")
                                            .font(.system(size: 15))
                                            .foregroundStyle(Color.gray)
                                        
                                        Text(item)
                                            .font(.system(size: 15))
                                            .foregroundStyle(Color.black)
                                        
                                        Spacer()
                                    }
                                    .padding(.horizontal, 10)
                                }
                                .buttonStyle(PlainButtonStyle())
                                
                                Divider()
                                    .frame(height: 10)
                            }
                        }
                        .padding(.vertical, 20)
                    }
                    
                    if !vm.tags.isEmpty {
                        HStack(spacing: 0) {
                            Text("热搜指南")
                                .bold()
                                .font(.system(size: 14))
                                .foregroundStyle(.black)
                            
                            Spacer()
                            
                            Button {
                                // 添加旋转动画
                                withAnimation(.linear(duration: 0.5)) {
                                    rotationAngle += 360 // 每次增加360度
                                }
                                vm.getTags()
                            } label: {
                                Image("refresh")
                                    .resizable()
                                    .frame(width: 18, height: 18)
                                    .rotationEffect(.degrees(rotationAngle))
                            }

                        }
                        .padding(.vertical, 10)
                        .padding(.horizontal, 10)
                        
                        // 热搜词列表
                        TagListView(tags: vm.tags, router: router)
                            .padding(.horizontal, 10)
                    }
                }
            }
        }
        .navigationBarBackButtonHidden(true)
        .onAppear{
            vm.getHotWord(text: $pleaseHold)
        }
    }
}

#Preview {
    SearchView()
        .environmentObject(Router.shared)
}
